body,p{
    margin: 0;
    padding: 0;
}
body{
    background-color: #fff;
    padding-bottom: 0.4rem;
}

.member-card{
    width: 3.45rem;
    height: 1.85rem;
    margin: 0 auto;
    margin-top: 0.1rem;
    background: url('../images/vipcard.png') no-repeat 0 0;
    background-size: contain;
    position: relative;
    span{
        color: #60606A;
        font-size: 0.11rem;
        position: absolute;
        left: 0.3rem;
        bottom: 0.35rem;
    }
}
.have-card{
    background: url('../images/vipcard1.png') no-repeat 0 0;
    background-size: contain;
}
.member-power{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    .power-item{
        width: 33%;
        height: 1.06rem;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        .power-item-img{
            width: 0.5rem;
            height: 0.5rem;
            border-radius: 50%;
            background-color: #EDEFF3;
            margin-bottom: 0.06rem;
            background:url(../images/icon1.png) no-repeat 0 0;
            background-size: contain;
        }
        span{
            color: #40404E;
            font-size: 0.12rem;
        }
    }
    .power-item:nth-child(1){
        .power-item-img{
            background:url(../images/icon1.png) no-repeat 0 0;
            background-size: contain;
        }
    }
    .power-item:nth-child(2){
        .power-item-img{
            background:url(../images/icon2.png) no-repeat 0 0;
            background-size: contain;
        }
    }
    .power-item:nth-child(3){
        .power-item-img{
            background:url(../images/icon3.png) no-repeat 0 0;
            background-size: contain;
        }
    }
    .power-item:nth-child(4){
        .power-item-img{
            background:url(../images/icon4.png) no-repeat 0 0;
            background-size: contain;
        }
    }
    .power-item:nth-child(5){
        .power-item-img{
            background:url(../images/icon5.png) no-repeat 0 0;
            background-size: contain;
        }
    }
    .power-item:nth-child(6){
        .power-item-img{
            background:url(../images/icon6.png) no-repeat 0 0;
            background-size: contain;
        }
    }
}

.blank{
    width: 100%;
    height: 0.1rem;
    background-color: #F7F8FB;
    margin-top: 0.1rem;
}

.member-pay{
    padding: 0.2rem;
    .member-pay-card{
        display: flex;
        justify-content: space-between;
        align-items: center;
        .card-item{
            width: 1.04rem;
            height: 0.79rem;
            border: 0.005rem solid #D0D0DA;
            border-radius: 0.1rem;
            position: relative;
            >span{
                position: absolute;
                font-size: 0.13rem;
                color: #40404E;
                top:0.06rem;
                left:0.15rem;
                font-weight: 500;
            }
            .card-price{
                position: absolute;
                bottom: 0.06rem;
                left: 0.12rem;
                color: #40404E;
                span:nth-child(1){
                    font-size: 0.12rem;
                    font-weight: 500;
                }
                span:nth-child(2){
                    font-size: 0.25rem;
                    font-weight: bold;
                }
                span:nth-child(3){
                    color: #FF242A;
                    font-size: 0.11rem;
                }
            }
        }
        .current-card{
            width: 1.01rem;
            height: 0.76rem;
            border: 0.02rem solid #3D79FF;
            .yes{
                width: 0.25rem;
                height: 0.25rem;
                background: url('') no-repeat 0 0;
                background-size: 100%;
                position: absolute;
                top: -0.01rem;
                right: -0.01rem;
            }
        }
    }
    .member-pay-methods{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 0.15rem;
        .methods-item{
            width: 1.59rem;
            height: 0.59rem;
            border: 0.005rem solid #D0D0DA;
            border-radius: 0.1rem;
            display: flex;
            justify-content: center;
            align-items: center;
            .weixin{
                width: 1.1rem;
                height: 0.28rem;
                background: url('../images/weixin.png') no-repeat 0 0;
                background-size: contain;
            }
            .alipay{
                width: 1.1rem;
                height: 0.28rem;
                background: url('../images/alipay.png') no-repeat 0 0;
                background-size: contain;
            }
            
        }
        .current-methods{
            width: 1.56rem;
            height: 0.56rem;
            border: 0.02rem solid #3D79FF;
            position: relative;
            .yes{
                width: 0.25rem;
                height: 0.25rem;
                background: url('') no-repeat 0 0;
                background-size: 100%;
                position: absolute;
                top: -0.01rem;
                right: -0.01rem;
            }
        }
    }
    .pay-btn{
        width: 100%;
        height: 0.48rem;
        background-color: #3D79FF;
        border-radius: 0.24rem;
        text-align: center;
        line-height: 0.48rem;
        color: #fff;
        font-size: 0.17rem;
        font-weight: 600;
        margin-top: 0.2rem;
    }
    .pay-agreement{
        width: 100%;
        text-align: center;
        color: #90909A;
        font-size: 0.12rem;
        margin-top: 0.15rem;
        padding-bottom: 0.4rem;
        span{
            color: #3D79FF;
        }
    }
}